<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><!-- Prima stesura Dicembre 2002 Ultima modifica Settembre 2011

Grazie per questa consultazione del sorgente!
   
Questa guida è completamente gratuita dal sito on line: www.web-link.it/css 
è costata tempo e fatica soltanto a me: Andrea Bianchi che ne sono il suo autore.
Puoi usarla ma non distribuirla su altri siti, neppure parzialmente, senza la mia autorizzazione scritta.

Se hai problemi dubbi o altro chiedi pure sul Forum gratuito.

Ho trovato siti che dal mio hanno copiato molto, in alcuni casi troppo, 
significa che ho lavorato davvero molto bene... 
Ciò che difficilmente potranno copiare sono le mie idee...

Se ti serve qualcosa, fai pure, serviti... 
Il sito e' stato fatto proprio per questo. 
Se poi la tua coscienza ti impedisse sonni tranquilli :)
Ti basta un piccolo link al mio: http://www.web-link.it 
E sei a posto... 
Se me lo comunichi, ricambierò anche quello, il link.

// -->

<title>Guida Fogli di Stile CSS | Layout di Esempio</title>
<meta http-equiv="title" content="Guida CSS Layout di esempio Fogli di Stile di Web-Link: Tutto per la costruzione delle tue pagine web.">
<meta name="description" content="Layout di esempio CSS guida che illustra come creare pagine web usando le più recenti tecniche e facendo riferimento a standard come XHTML passando dai CSS Cascadin Style Sheet o Fogli di Stile in cascata.">
<meta name="keywords" content="layout liquido, box model, box liquido, XHTML, CSS, XML, Fogli, stile, html, dhtml, DTD, javascript,  dinamico, dynamichtml, cascading style, sheets, webdesigner, webmaster">
<meta name="keyphrase" content="XHTML CSS, HTML CSS, Style Sheets, fogli di style, cascading sheets, Extensible HyperText Markup Language, Document Object Model, XHTML Tutorials, costruzione pagina web, come fare pagine web, cosa serve per fare pagine web">
<meta name="category" content="computers and internet">
<meta name="robots" content="all">
<meta name="distribution" content="global">
<meta name="identifier" content="http://www.web-link.it">
<meta name="author" content="Andrea Bianchi">
<meta name="language" content="Italian">
<meta name="resource-type" content="document">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="content-style-type" content="text/css">
<meta http-equiv="Content-type" content="text/html; charset=windows-1252">
<meta http-equiv="imagetoolbar" content="false">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="guida" href="../css/css.htm" title="Guida ai fogli di style">

<style type="text/css">
<!-- 
body {
text-align: center; /* IE5.x */
background-image: url('ugr.png'); 
 background-color: #dfefdf;
 font-family: Verdana, Arial, sans-serif;
	color: #000066;
	padding: 0;
    margin: 0;
	font-size: 11pt;
}

#telaio {
border:1px solid gray;
line-height:150%;
color: black;
background-color: #ffc;
text-align: left; /* IE5.x */
}

#testata{
font-size: 130%;
}

#fondo {
font-size: 85%;
clear: both;
}

#testata, #fondo {
padding:0.5em;
color:white;

background-color: #c90;
text-align: center;
}

#sinistro {
float:left;
width:160px;
margin: 0px;
padding: 5px;
}

#centrale {
margin-left: 170px;
border-left:1px solid gray;
padding:10px;
}
 -->
</style>
</head><body>
<div id="telaio">
<div id="testata">
CSS guida ai fogli di Style di Web-Link.it
</div>
<div id="sinistro">
<p class="cs1">Questa la parte sinistra destinata a contenere i links che fanno da menù per richiamare le informazioni che saranno visualizzate nel box contenitore centrale.
</p>
voce 1<br>
voce 2<br>
voce 3<br>
voce 4<br>
voce 5<br>
ecc. ecc.
</div>
<div id="centrale">
<h2>CSS guida ai fogli di Style: il layout</h2>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
<p class="cs1">Testo dimostrativo inserito solo per riempire la pagina </p>
</div>
<div id="fondo">CSS guida ai fogli di Style di Web-Link.it il Layout</div>
</div>
<p style="text-align: center;">

<a href="http://jigsaw.w3.org/css-validator/validator?uri=http://www.web-link.it/css/css.css" target="_blank"><img style="border:0;width:88px;height:31px" src="vcss.png" alt="Valid CSS!" height="31" width="88" border="0"></a>&nbsp;&nbsp;<a href="http://validator.w3.org/check?uri=referer" target="_blank"><img src="valid-html401.png" alt="Valid HTML 4.01 Transitional" height="31" width="88" border="0"></a></p>
</body>
</html>
